<!DOCTYPE html>
<!-- saved from url=(0059)file:///D:/work/project/flask_post_demo/templates/test.html -->
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta charset="utf-8">
  <title></title>
<style type="text/css"></style>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('#confirm').click(function(){
        console.log('post');
        first = $("#firstname").val();
        second = $("#secondname").val();
        // console.log(first, second)
        $.ajax({
            type: 'POST',
            url: '/post_data/',
            data: {"first": first, "second": second},
            dataType: 'json',
            success: function(data){
                $("#name").text(data["data"]);
                // console.log(data["data"]);
            },
            error: function(xhr, type){}
        });
    });
});

</script>
</head>
<body>
This is a test page.

<div>
<input type="text" value="Zhang" id='firstname' name="firstname"><br />
<input type="text" value="Jia" id='secondname' name="secondname"><br />
<p id="name">Zhang Jia</p>
<input type="button" id='confirm' value="确认">
</div>
</body></html>